import React, {Component} from 'react';
import Svg, {
  Circle,
  Ellipse,
  G,
  Text,
  TSpan,
  TextPath,
  Path,
  Polygon,
  Polyline,
  Line,
  Rect,
  Use,
  Image,
  Symbol,
  Defs,
  SvgXml,
  LinearGradient,
  Stop,
  ClipPath,
} from 'react-native-svg';
import {SvgCssUri} from 'react-native-svg/css';
import {
  View,
  StyleSheet,
  ScrollView,
  Alert,
  Button,
  Text as RNText,
} from 'react-native';
import {Tester, Filter, TestCase, TestSuite} from '@rnoh/testerino';
import {TestItem} from './gen';

const dataUriExample =
  '';

class LinearGradientExample extends Component {
  static title = 'SVG with LinearGradient';
  render() {
    return (
      <Svg width="400" height="200" viewBox="0 0 500 400">
        <Defs>
          <LinearGradient id="gradient" x1="0%" y1="0%" x2="100%" y2="0%">
            <Stop offset="0%" stopColor="rgb(255,0,0)" />
            <Stop offset="100%" stopColor="rgb(0,0,255)" />
          </LinearGradient>
        </Defs>
        <Rect x="50" y="50" width="200" height="100" fill="url(#gradient)" />
        <Circle
          cx="300"
          cy="200"
          r="100"
          stroke="black"
          strokeWidth="5"
          fill="none"
        />
        <Text
          x="300"
          y="205"
          textAnchor="middle"
          fontSize="24"
          fill="url(#gradient)">
          SVG Circle
        </Text>
        <Path
          d="M100,100 C100,200 200,200 200,100"
          stroke="green"
          strokeWidth="2"
          fill="none"
        />
        <Rect x="400" y="50" width="100" height="100" fill="blue"></Rect>
        <Ellipse
          cx="50"
          cy="300"
          rx="100"
          ry="50"
          fill="url(#gradient)"></Ellipse>
      </Svg>
    );
  }
}

class HuaweiPathExample extends Component {
  static title = 'Huawei SVG icon';
  render() {
    return (
      <Svg width="100" height="100" viewBox="0 0 24 24">
        <G>
          <Polygon
            points="2.902,21.586 1.094,21.586 1.094,19.994 0.293,19.994 0.293,23.941 1.094,23.941 1.094,22.338 2.902,22.338    2.902,23.941 3.703,23.941 3.703,19.994 2.902,19.994  "
            fill={'red'}
          />
          <Path d="M7.414,22.253c0,0.642-0.319,0.984-0.897,0.984c-0.582,0-0.902-0.353-0.902-1.011v-2.23H4.813v2.257   C4.813,23.363,5.43,24,6.506,24c1.086,0,1.709-0.649,1.709-1.78v-2.226H7.414V22.253z" />
          <Polygon
            points="16.67,22.708 15.773,19.993 15.12,19.993 14.224,22.708 13.352,19.996 12.499,19.996 13.875,23.941 14.538,23.941    15.436,21.349 16.333,23.941 17.002,23.941 18.374,19.996 17.543,19.996  "
            fill={'red'}
          />
          <Polygon
            fill={'yellow'}
            points="19.81,22.242 21.267,22.242 21.267,21.523 19.81,21.523 19.81,20.715 21.924,20.715 21.924,19.997 19.02,19.997    19.02,23.939 22,23.939 22,23.22 19.81,23.22  "
          />
          <Rect
            fill={'green'}
            x="22.955"
            y="19.994"
            width="0.79"
            height="3.942"
          />
          <Path
            fill={'pink'}
            d="M11.604,23.117l0.354,0.821h0.839l-1.732-3.944h-0.706L8.62,23.938h0.818l0.36-0.821H11.604z M10.699,20.992l0.607,1.413   h-1.211L10.699,20.992z"
          />
          <Path
            fill={'red'}
            d="M22.047,7.008c0.13-2.021-1.904-3.891-1.904-3.891s-3.772,4.569-6.521,10.569c-0.014,0.031-0.019,0.084,0.013,0.112   c0.022,0.018,0.063,0.031,0.106,0.01c1.03-0.511,5.314-2.717,7.118-4.439C20.859,9.369,21.987,8.463,22.047,7.008 M17.239,2.448   c0,0-0.472-1.761-2.385-2.226c0,0-0.551-0.14-1.137-0.222c0,0-2.139,2.753-1.099,13.142c0.005,0.054,0.035,0.074,0.059,0.081   c0.039,0.01,0.076-0.004,0.102-0.041c0.686-0.991,3.813-5.626,4.448-8.445C17.227,4.737,17.571,3.373,17.239,2.448 M14.307,15.276   c-0.011,0.023-0.021,0.079,0.022,0.11c0.691,0.495,2.785,1.96,3.794,2.244c0,0,1.866,0.636,3.486-2.148   c0,0-5.423-0.189-7.226-0.252C14.358,15.229,14.321,15.247,14.307,15.276 M23.53,9.1c0,0-6.135,3.295-9.307,5.432   c-0.023,0.016-0.053,0.047-0.037,0.103c0.008,0.03,0.037,0.057,0.075,0.057c1.135,0.002,5.435,0.007,5.543-0.013   c0,0,0.556-0.022,1.243-0.286c0,0,1.529-0.486,2.323-2.223C23.37,12.171,24.078,10.755,23.53,9.1 M9.77,14.532   C6.598,12.395,0.463,9.1,0.463,9.1c-0.548,1.655,0.16,3.071,0.16,3.071c0.794,1.736,2.323,2.223,2.323,2.223   c0.687,0.264,1.243,0.286,1.243,0.286c0.108,0.02,4.408,0.015,5.543,0.013c0.038,0,0.067-0.027,0.075-0.057   C9.822,14.579,9.793,14.548,9.77,14.532 M9.61,15.23c-1.803,0.063-7.226,0.252-7.226,0.252C4.005,18.266,5.87,17.63,5.87,17.63   c1.009-0.284,3.104-1.749,3.794-2.244c0.044-0.031,0.033-0.088,0.022-0.11C9.672,15.247,9.635,15.229,9.61,15.23 M9.139,0.222   C7.226,0.687,6.754,2.448,6.754,2.448C6.422,3.373,6.766,4.737,6.766,4.737c0.635,2.819,3.762,7.455,4.448,8.445   c0.026,0.037,0.063,0.051,0.102,0.041c0.025-0.007,0.054-0.026,0.06-0.081C12.415,2.753,10.276,0,10.276,0   C9.69,0.082,9.139,0.222,9.139,0.222 M3.85,3.117c0,0-2.034,1.87-1.904,3.891c0.06,1.455,1.188,2.361,1.188,2.361   c1.805,1.721,6.088,3.927,7.118,4.439c0.042,0.021,0.083,0.008,0.106-0.01c0.033-0.028,0.027-0.08,0.013-0.112   C7.622,7.685,3.85,3.117,3.85,3.117"
          />
        </G>
      </Svg>
    );
  }
}

class ApplePathExample extends Component {
  static title = 'Apple SVG icon';
  render() {
    return (
      <Svg width="100" height="100" viewBox="0 0 30 30">
        <G id="_Group_2">
          <G id="_Group_3">
            <Path
              id="_Path_"
              d="M18.546,12.763c0.024-1.87,1.004-3.597,2.597-4.576c-1.009-1.442-2.64-2.323-4.399-2.378    c-1.851-0.194-3.645,1.107-4.588,1.107c-0.961,0-2.413-1.088-3.977-1.056C6.122,5.927,4.25,7.068,3.249,8.867    c-2.131,3.69-0.542,9.114,1.5,12.097c1.022,1.461,2.215,3.092,3.778,3.035c1.529-0.063,2.1-0.975,3.945-0.975    c1.828,0,2.364,0.975,3.958,0.938c1.64-0.027,2.674-1.467,3.66-2.942c0.734-1.041,1.299-2.191,1.673-3.408    C19.815,16.788,18.548,14.879,18.546,12.763z"
            />
            <Path
              id="_Path_2"
              d="M15.535,3.847C16.429,2.773,16.87,1.393,16.763,0c-1.366,0.144-2.629,0.797-3.535,1.829    c-0.895,1.019-1.349,2.351-1.261,3.705C13.352,5.548,14.667,4.926,15.535,3.847z"
            />
          </G>
        </G>
      </Svg>
    );
  }
}

class SvgXmlExample extends Component {
  static title = 'SVG Xml';
  render() {
    return (
      <SvgXml
        override={{
          width: 200,
          height: 200,
        }}
        xml={`
        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve" width="512" height="512">
            <g>
                <g>
                    <g>
                        <g>
                            <g>
                                <path d="M21.432,6.623c0.117,0.847,1.401,1.988,1.748,1.962c0.233-0.021,0.322-1.105,0.322-1.962       c0-0.49,0.027-0.874-0.231-0.963C22.859,6.49,21.781,6.659,21.432,6.623z M21.505,6.249c0.926,0,1.774-0.74,1.774-1.39       c0-0.304-0.144-0.553-0.509-0.597c0.063,0.08,0.089,0.142,0.089,0.286c0,0.489-0.748,1.034-1.56,1.034       c-0.295,0-0.383,0.205-0.383,0.312C20.916,6.142,21.157,6.249,21.505,6.249z M21.307,5.241c-0.124,0-0.303,0-0.401-0.197       c-0.08-0.16-0.053-0.42-0.205-0.533c0.151,0.043,0.311,0.043,0.437,0.043c0.402,0,0.785-0.275,1.079-0.275       c0.195,0,0.257,0.124,0.257,0.249C22.476,4.921,21.684,5.241,21.307,5.241z"/>
                            </g>
                            <g>
                                <path d="M1.364,12.231c0.303,0,0.241-1.854,0.731-1.854c0.115,0,0.151,0.116,0.151,0.257c0,0.42-0.204,1.035-0.204,1.374       c0,0.169,0.043,0.222,0.124,0.222c0.214,0,0.589-2.042,0.954-2.042c0.117,0,0.17,0.118,0.17,0.233       c0,0.428-0.543,1.659-0.543,2.005c0,0.053,0.017,0.098,0.061,0.098c0.223,0,0.669-0.962,0.811-1.444       c0.081-0.249,0.187-0.384,0.286-0.384c0.089,0,0.17,0.098,0.17,0.304c0,0.481-0.447,1.614-0.837,2.371       c-0.304,0.588-0.775,1.436-0.775,1.907c0,0.241,0.043,0.492,0.391,0.795c-0.571-0.036-0.803-0.089-1.017-0.535       c-0.953,1.898,1.756,1.711,0.828,3.396c-0.168-0.303-1.505-0.614-1.505-2.38c0-1.525,1.336-2.417,1.336-3.05       c0-0.125-0.045-0.231-0.16-0.329c-0.294-0.251-0.304-0.455-0.535-0.455c-0.17,0-0.375,0.393-0.161,0.74       c0.072,0.116,0.134,0.186,0.134,0.295c0,0.249-0.393,0.918-0.668,0.918c-0.277,0-0.491-0.687-0.491-1.792       c0-0.981,0.222-1.971,0.499-1.971c0.081,0,0.107,0.053,0.107,0.125c0,0.116-0.035,0.346-0.035,0.74       C1.187,12.196,1.285,12.231,1.364,12.231z"/>
                            </g>
                            <g>
                                <path d="M3.638,14.843c0.374,0,0.686-0.278,0.686-0.891v-0.909c0-0.347,0.027-0.739,0.259-1.018       c-0.026,0.117-0.026,0.242-0.026,0.357c0,0.767,0.428,1.294,0.428,2.034c0,0.275-0.081,0.427-0.295,0.427       c-0.204,0-0.186-0.187-0.231-0.187c-0.035,0-0.089,0.115-0.089,0.24c0,0.188,0.133,0.482,0.506,0.482       c0.322,0,0.58-0.294,0.58-0.624c0-0.802-0.624-1.693-0.624-2.55c0-0.375,0.099-0.624,0.179-0.822       c0,1.775,1.507,3.068,1.507,3.807c0,0.171-0.126,0.304-0.312,0.304c-0.206,0-0.304-0.163-0.304-0.286       c0-0.062-0.01-0.079-0.036-0.079c-0.053,0-0.213,0.179-0.213,0.41c0,0.293,0.24,0.65,0.686,0.65       c0.508,0,0.785-0.429,0.785-0.812c0-0.935-1.828-2.354-1.828-3.868c0-0.259,0.045-0.677,0.232-0.999       c-1.177,0.757-1.542,1.765-1.542,2.647c0,0.767-0.027,1.151-0.419,1.151c-0.205,0-0.258-0.187-0.329-0.187       c-0.054,0-0.082,0.16-0.082,0.206C3.156,14.656,3.398,14.843,3.638,14.843z"/>
                            </g>
                            <g>
                                <path d="M19.089,5.937c0.393,0,0.687-0.178,0.687-0.286c0-0.035-0.053-0.062-0.169-0.062c-0.116,0-0.348-0.008-0.786-0.08       c-0.375-0.062-0.661-0.204-0.767-0.204C18.019,5.305,18,5.322,18,5.349C18,5.581,18.428,5.937,19.089,5.937z M17.145,4.804       c0.114-0.075,0.617,0.046,1.266-0.276c0.081-0.045,0.16-0.063,0.231-0.063c0.312,0,0.233,0.357,0.519,0.357       c0.221,0,0.508-0.187,0.678-0.187c0.265,0,0.649,0.838,0.649,1.229c0,0.456-0.684,0.732-1.498,0.732       c-1.184,0-1.899-1.034-1.899-1.702C17.091,4.841,17.118,4.823,17.145,4.804z"/>
                            </g>
                            <g>
                                <path d="M3.826,18.204c-0.295,0.073-0.767,0.535-0.767,1.267c0,0.874,0.936,2.221,2.479,2.221c1.301,0,1.622-0.9,1.622-1.508       c0-1.347-0.83-2.291-1.907-2.291c-0.59,0-1.116,0.429-1.116,1.061c0,0.589,0.446,1.472,1.507,1.472       c0.5,0,0.793-0.357,0.793-0.767c0-0.402-0.365-0.954-0.9-0.954c-0.162,0-0.276,0.105-0.276,0.275       c0,0.214,0.294,0.43,0.659,0.43c0.089,0,0.161-0.018,0.198-0.036c0.018,0.026,0.026,0.071,0.026,0.107       c0,0.204-0.198,0.331-0.5,0.331c-0.455,0-0.893-0.34-0.893-0.875c0-0.32,0.277-0.553,0.677-0.553       c0.794,0,1.267,0.704,1.267,1.408c0,0.634-0.348,1-1.061,1C4.208,20.791,3.513,19.506,3.826,18.204z"/>
                            </g>
                            <g>
                                <path d="M13.312,21.646c0,0.196,0.16,0.358,0.356,0.358c0.196,0,0.358-0.162,0.358-0.358c0-0.195-0.162-0.356-0.358-0.356       C13.472,21.29,13.312,21.451,13.312,21.646z M14.002,23.428c0.429,0,0.406-0.036,0.54-0.036c0.134,0,0.143,0.08,0.143,0.135       c0,0.195-0.437,0.437-1.213,0.437c-0.455,0-0.731-0.241-0.812-0.508C12.214,23.74,11.538,24,10.868,24       c-1.827,0-2.291-0.794-2.862-1.052c-0.437-0.196-1.106,0.186-2.042-0.857c0.124,0.026,0.294,0.036,0.427,0.036       c0.821,0,1.257-0.401,1.257-1.044c0-0.078-0.008-0.168-0.018-0.247c0.251,0.098,0.822,0.524,0.956,1.281       c0.018,0.091,0.384,0.17,0.615,0.17c0.321,0,0.73-0.132,0.793-0.659c1.07-0.088,1.793-0.721,1.944-1.525       c0.382,0.125,0.819,0.473,0.927,0.651c0.151-0.053,0.33-0.08,0.535-0.08c0.285,0,0.605,0.053,0.989,0.171       c0.018-0.117,0.036-0.261,0.215-0.261c0.266,0,0.195,0.296,0.284,0.465c0.045,0.088,0.269,0.142,0.269,0.321       c0,0.17-0.144,0.231-0.233,0.231c-0.036,0-0.081-0.009-0.107-0.017c-0.177,0.061-0.186,1.346-0.937,1.346       c-0.551,0-1.061-0.456-1.283-1.024c-0.062-0.171-0.195-0.278-0.321-0.278c-0.143,0-0.222,0.027-0.391,0.214       c-0.482,0.526-1.283,0.981-2.274,0.981c-0.303,0-0.543-0.027-0.606-0.027c-0.035,0-0.035,0.008-0.035,0.019       c0,0.061,0.302,0.302,0.961,0.302c1.57,0,1.954-0.883,2.203-0.883c0.037,0,0.143,0,0.204,0.143       C12.704,23.233,13.503,23.428,14.002,23.428z"/>
                            </g>
                            <g>
                                <path d="M19.41,17.749c-0.187,0-1.223,1.383-1.89,1.383c-0.16,0-0.293-0.303-0.293-0.533c0-0.127,0.08-0.216,0.364-0.277       c1.534-0.349,1.195-1.499,2.504-1.499c0.722,0,1.525,0.491,1.525,1.596c0,1.177-1.675,2.638-1.925,2.638       c-0.205,0-0.428-0.293-0.428-0.49c0-0.061,0.026-0.141,0.206-0.213c0.854-0.339,1.344-1.124,1.344-1.524       c0-0.091-0.045-0.179-0.16-0.179c-0.151,0-0.8,1.481-1.524,1.481c-0.5,0-1.008-0.455-1.008-0.668       c0-0.358,1.446-1.018,1.446-1.516C19.571,17.757,19.482,17.749,19.41,17.749z M20.372,17.196c-0.125,0-0.259,0.099-0.259,0.341       c0,0.266,0.206,0.435,0.322,0.489c0.062,0.035,0.16,0.071,0.257,0.071c0.258,0,0.464-0.071,0.464-0.287       C21.157,17.537,20.755,17.196,20.372,17.196z"/>
                            </g>
                            <g>
                                <path d="M3.717,6.872c0,0.198,0.163,0.358,0.358,0.358c0.195,0,0.356-0.16,0.356-0.358c0-0.196-0.161-0.355-0.356-0.355       C3.88,6.517,3.717,6.677,3.717,6.872z M3.255,6.069c0,0.197,0.16,0.359,0.356,0.359c0.195,0,0.357-0.161,0.357-0.359       c0-0.195-0.162-0.355-0.357-0.355C3.415,5.714,3.255,5.874,3.255,6.069z M2.934,8.513C2.729,8.568,2.301,8.817,2.301,9.262       c0,0.321,0.249,0.527,0.561,0.527c0.16,0,0.277-0.037,0.347-0.09C2.96,9.459,2.871,9.191,2.871,8.923       C2.871,8.736,2.898,8.621,2.934,8.513z M0.749,8.639C0.742,8.684,0.742,8.728,0.742,8.773c0,0.418,0.222,0.651,0.516,0.651       c0.222,0,0.482-0.135,0.713-0.429C1.873,9.013,1.757,9.021,1.65,9.021C1.32,9.021,0.964,8.932,0.749,8.639z M0.437,9.432       c0,0.678,0.206,0.999,0.572,0.999c0.284,0,0.668-0.206,1.123-0.598C1.783,9.914,1.516,9.967,1.275,9.967       C0.955,9.967,0.704,9.843,0.437,9.432z M2.747,5.865c0.045-0.143,0.08-0.32,0.08-0.516c0-0.429-0.197-1.079-0.802-1.079       c-0.347,0-0.598,0.276-0.598,0.606C1.426,5.581,2.132,5.865,2.747,5.865z M1.988,8.112c-0.293,0-0.615-0.366-0.615-0.696       c0-0.178,0.133-0.4,0.233-0.4c0.035,0,0.053,0.026,0.061,0.088c0.055,0.437,0.34,0.687,0.607,0.811       c0.027,0.018,0.045,0.027,0.045,0.046C2.319,8.022,2.149,8.112,1.988,8.112z M2.808,7.025c0.063,0.083,0.234,0.186,0.234,0.251       c0,0.124-0.073,0.284-0.215,0.284c-0.312,0-0.561-0.473-0.561-0.739c0-0.171,0.097-0.189,0.231-0.189       c0.063,0,0.09,0.009,0.133,0.035C2.711,6.712,2.711,6.89,2.808,7.025z M0.713,8.13C0.698,8.157,0.687,8.193,0.687,8.228       c0,0.08,0.09,0.17,0.169,0.17c0.072,0,0.116-0.018,0.153-0.018c0.213,0,0.453,0.151,0.802,0.151       c0.204,0,0.446-0.063,0.749-0.213C3.202,7.997,3.451,7.203,3.451,7.07c0-0.171-0.137-0.147-0.249-0.304       C3.088,6.61,3.131,6.474,3.058,6.4C3.017,6.358,2.889,6.357,2.729,6.339c-0.055-0.007-0.126-0.01-0.197-0.01       c-0.294,0-0.644,0.037-1.035,0.285C0.724,7.108,0.838,7.924,0.713,8.13z M3.674,7.773c-0.196,0.232-0.4,0.625-0.4,1.026       c0,0.481,0.293,0.884,0.748,0.884c0.437,0,0.641-0.375,0.641-0.759C4.663,8.326,4.119,7.907,3.674,7.773z M1.766,6.062       c0,0-0.26,0.195-0.579,0.195C0.803,6.257,0.5,5.973,0.5,5.571c0-0.276,0.143-0.562,0.473-0.704       C0.964,4.921,0.964,4.965,0.964,5.019C0.964,5.527,1.249,5.911,1.766,6.062z"/>
                            </g>
                            <g>
                                <path d="M17.484,9.021c0,0.206,0.171,0.375,0.374,0.375c0.204,0,0.375-0.169,0.375-0.375c0-0.204-0.171-0.373-0.375-0.373       C17.655,8.648,17.484,8.817,17.484,9.021z M17.51,10.145c0,0.233,0.189,0.419,0.42,0.419c0.23,0,0.418-0.186,0.418-0.419       c0-0.231-0.188-0.418-0.418-0.418C17.699,9.727,17.51,9.914,17.51,10.145z M16.227,10.903c0,0.338,0.276,0.615,0.615,0.615       c0.338,0,0.615-0.277,0.615-0.615c0-0.339-0.277-0.616-0.615-0.616C16.503,10.288,16.227,10.564,16.227,10.903z M16.556,9.645       c0,0.197,0.161,0.357,0.357,0.357c0.196,0,0.355-0.16,0.355-0.357c0-0.196-0.159-0.357-0.355-0.357       C16.717,9.288,16.556,9.449,16.556,9.645z M15.388,10.36c0,0.195,0.162,0.355,0.355,0.355c0.197,0,0.358-0.16,0.358-0.355       c0-0.196-0.161-0.358-0.358-0.358C15.55,10.002,15.388,10.164,15.388,10.36z M16.306,8.273c0,0.312,0.259,0.571,0.572,0.571       c0.312,0,0.571-0.258,0.571-0.571c0-0.312-0.258-0.571-0.571-0.571C16.565,7.703,16.306,7.961,16.306,8.273z M16.976,7.176       c0,0.187,0.151,0.34,0.34,0.34c0.187,0,0.34-0.153,0.34-0.34c0-0.186-0.153-0.339-0.34-0.339       C17.127,6.836,16.976,6.989,16.976,7.176z M15.364,8.032c0,0.188,0.15,0.339,0.336,0.339c0.187,0,0.339-0.151,0.339-0.339       c0-0.187-0.152-0.339-0.339-0.339C15.513,7.693,15.364,7.844,15.364,8.032z M15.317,9.191c0,0.304,0.242,0.543,0.543,0.543       c0.303,0,0.544-0.239,0.544-0.543c0-0.303-0.241-0.543-0.544-0.543C15.56,8.648,15.317,8.888,15.317,9.191z M14.195,9.761       c0,0.277,0.231,0.508,0.508,0.508s0.508-0.231,0.508-0.508c0-0.276-0.232-0.507-0.508-0.507S14.195,9.485,14.195,9.761z        M14.497,8.504c0,0.196,0.162,0.357,0.357,0.357c0.197,0,0.357-0.161,0.357-0.357c0-0.195-0.16-0.356-0.357-0.356       C14.658,8.148,14.497,8.309,14.497,8.504z M17.627,11.25c0-0.178,0.161-0.329,0.338-0.329c0.196,0,0.348,0.151,0.348,0.329       c0,0.205-0.152,0.349-0.348,0.349C17.788,11.599,17.627,11.455,17.627,11.25z"/>
                            </g>
                            <g>
                                <path d="M17.858,21.504c0.044,0,0.098,0.026,0.098,0.187c0,0.195-0.089,0.455-0.409,0.658       c-0.224,0.152-0.527,0.278-0.973,0.285c0.071-0.214,0.125-0.437,0.125-0.65c0-0.072-0.009-0.125-0.018-0.204h0.116       C17.502,21.781,17.806,21.504,17.858,21.504z M17.93,20.621c0.071-0.063,0.088-0.161,0.088-0.259v-0.205       c0-0.259-0.392-0.41-0.928-0.41c-0.651,0-0.998,0.295-0.998,0.419v0.41c0,0.17,0.393,0.339,0.874,0.339       C17.351,20.915,17.699,20.817,17.93,20.621z M18.392,20.719c-0.232,0.179-0.775,0.58-1.675,0.58       c-0.482,0-0.696-0.152-0.767-0.152c-0.089,0-0.188,0.089-0.286,0.205c-0.212,0.25-0.488,0.715-0.488,1.222       c0,0.358,0.277,0.712,0.792,0.712c1.669,0,2.916-1.041,2.916-1.889C18.883,20.915,18.598,20.719,18.392,20.719z"/>
                            </g>
                            <g>
                                <path d="M18.705,13.221c0,0.223,0.072,0.481,0.295,0.481c0.187,0,0.347-0.285,0.347-0.597c0-0.356-0.062-0.634-0.062-0.775       c0-0.063,0.027-0.089,0.062-0.089c0.135,0.009,0.26,0.375,0.403,0.375c0.16,0,0.399-0.295,0.496-0.295       c0.027,0,0.035,0.035,0.035,0.045c0,0.133-0.204,0.428-0.204,0.543c0,0.098,0.517,0.116,0.517,0.206       c0,0.133-0.543,0.133-0.802,0.249c-0.249,0.107-0.402,0.241-0.402,0.419c0,0.178,0.179,0.213,0.429,0.213       c0.597,0,1.014-0.32,1.149-0.32c0.027,0,0.043,0.018,0.043,0.044c0,0.09-0.302,0.383-0.302,0.518       c0,0.151,0.554,0.327,0.543,0.418c-0.008,0.026-0.044,0.035-0.106,0.035c-0.098,0-0.249-0.027-0.367-0.027       c-0.071,0-0.133,0.01-0.16,0.045c-0.062,0.071,0.018,0.544-0.107,0.544c-0.116,0-0.419-1.052-1.104-1.052       c-0.098,0-0.17,0.08-0.17,0.215c0,0.355,0.348,0.766,0.679,0.962c0.15,0.097,0.399,0.197,0.399,0.25       c0,0.106-0.568,0.009-0.568,0.186c0,0.162,0.07,0.403,0.07,0.544c0,0.045-0.009,0.098-0.063,0.098       c-0.106,0-0.366-0.489-0.49-0.489c-0.107,0-0.339,0.293-0.437,0.293c-0.027,0-0.045-0.026-0.045-0.053       c0-0.206,0.331-0.668,0.331-1.124c0-0.214-0.027-0.677-0.286-0.677c-0.213,0-0.455,0.337-0.562,0.677       c-0.062,0.196-0.018,0.955-0.16,0.955c-0.135,0-0.1-0.508-0.277-0.508c-0.131,0-0.417,0.241-0.516,0.241       c-0.018,0-0.035-0.01-0.035-0.028c0-0.107,0.257-0.455,0.257-0.526c0-0.134-0.588-0.151-0.588-0.258       c0-0.064,0.231-0.107,0.446-0.144c0.453-0.079,1.122-0.408,1.122-0.873c0-0.518-0.499-0.74-0.828-0.954       c-0.17-0.107-0.356-0.196-0.356-0.267c0-0.071,0.214-0.071,0.304-0.071c0.133,0,0.265-0.01,0.265-0.117       c0-0.08-0.018-0.241-0.018-0.365c0-0.088,0.01-0.16,0.046-0.16c0.131,0,0.32,0.436,0.409,0.436c0.142,0,0.34-0.355,0.473-0.355       c0.045,0,0.063,0.027,0.063,0.107C18.875,12.525,18.705,12.9,18.705,13.221z M14.452,10.609       c0.098,0.757,1.116,0.375,1.116,1.291c0,0.133-0.036,0.33-0.036,0.499c0,0.198,0.018,0.367,0.167,0.367       c0.151,0,0.187-0.107,0.187-0.249c0-0.143-0.036-0.321-0.036-0.419c0-0.313,0.223-0.384,0.358-0.384       c0.338,0,0.598,0.348,1.106,0.348c-0.116,0.571-1.294,0.418-1.294,1.043c0,0.312,0.312,0.384,0.517,0.384       c0.189,0,0.251-0.027,0.251-0.187c0-0.089-0.018-0.187-0.018-0.251c0-0.034,0.026-0.071,0.071-0.071       c0.195,0,1.157,0.732,1.157,0.955c0,0.204-1.015,0.41-1.309,0.41c-0.09,0-0.108-0.063-0.108-0.097       c0-0.063,0.151-0.251,0.151-0.358c0-0.08-0.134-0.133-0.49-0.133c-0.17,0-0.294,0.018-0.294,0.151       c0,0.241,0.393,0.535,0.393,0.757c0,0.178-0.108,0.287-0.393,0.287c-0.242,0-0.606-0.189-0.606-0.5       c0-0.25,0.258-0.499,0.258-0.651c0-0.045-0.034-0.116-0.142-0.116c-0.329,0-0.419,0.873-1.588,0.971       c0.188-0.169,0.349-0.357,0.349-0.74c0-0.187-0.045-0.339-0.045-0.543c0-0.268,0.124-0.402,0.302-0.402       c0.331,0,0.491,0.464,0.706,0.464c0.116,0,0.241-0.106,0.241-0.267c0-0.678-1.302-0.579-1.302-1.533       C14.123,11.375,14.212,11.055,14.452,10.609z"/>
                            </g>
                            <g>
                                <path d="M16.145,16.403c0,0.126,0.09,0.223,0.216,0.223c0.142,0,0.23-0.126,0.23-0.268c0-0.186-0.169-0.446-0.329-0.446       c-0.073,0-0.046,0.107-0.064,0.223C16.19,16.225,16.145,16.332,16.145,16.403z M15.681,15.218       c0.937,0.178,1.446,0.883,1.446,1.543c0,0.455-0.284,0.873-0.784,0.873c-0.456,0-0.783-0.311-0.783-0.81       c0-0.375,0.292-0.766,0.292-1.151C15.851,15.521,15.807,15.368,15.681,15.218z M14.497,16.733       c0.089,0.089,0.116,0.178,0.116,0.269c0,0.133-0.063,0.276-0.063,0.428c0,0.212,0.162,0.399,0.393,0.399       c0.25,0,0.421-0.196,0.421-0.427C15.364,17.062,15.014,16.733,14.497,16.733z M17.449,16.164       c0.061,0.097,0.088,0.195,0.088,0.284c0,0.251-0.169,0.482-0.169,0.739c0,0.296,0.222,0.536,0.562,0.536       c0.365,0,0.614-0.293,0.614-0.642C18.545,16.609,18.116,16.208,17.449,16.164z M14.712,15.69       c0.41,0.053,0.508,0.197,0.508,0.312c0,0.197-0.178,0.259-0.348,0.259c-0.124,0-0.266-0.026-0.419-0.026       c-0.196,0-0.392,0.044-0.553,0.232c0.117,0.017,0.286,0.097,0.286,0.277c0,0.517-1.436,0.089-1.436,1.417       c0,0.704,0.731,1.471,1.837,1.471c0.572,0,0.938-0.186,0.938-0.402c0-0.169-0.304-0.053-0.304-0.195       c0-0.062,0.107-0.179,0.107-0.277c0-0.043-0.035-0.124-0.107-0.124c-0.159,0-0.464,0.258-1.079,0.258       c-0.481,0-0.954-0.276-0.954-0.65c0-0.081,0.036-0.126,0.089-0.126c0.054,0,0.126,0.037,0.189,0.037       c0.052,0,0.061-0.037,0.061-0.135c0-0.097,0-0.375,0.17-0.375c0.169,0,0.49,0.626,1.722,0.626c0.409,0,1.202-0.08,1.497-0.348       c-0.009,0.979-0.776,2.273-2.381,2.273c-1.667,0-2.559-1.337-2.559-2.568c0-1.363,1.114-2.602,2.639-2.602       c0.391,0,0.723,0.133,0.723,0.302C15.336,15.557,14.756,15.415,14.712,15.69z"/>
                            </g>
                            <g>
                                <path d="M8.943,5.509c0.587,0,0.855,0.509,0.855,1.079c0,0.249-0.071,0.615-0.187,0.615c-0.116,0-0.097-0.204-0.116-0.393       C9.479,6.57,9.433,6.517,9.352,6.517c-0.151,0-0.249,0.355-0.249,0.686c0,0.206,0.035,0.437,0.195,0.437       c0.089,0,0.17-0.044,0.224-0.098c-0.035,0.41-0.34,0.767-0.768,0.767c-0.783,0-1.077-0.917-1.167-1.453       C7.114,7.354,6.679,7.72,5.893,7.72c-0.731,0-1.061-0.535-1.061-1.044c0-0.152,0.054-0.544,0.241-0.544       c0.223,0,0.028,0.732,0.465,0.732c0.107,0,0.303-0.09,0.409-0.384c0.063-0.179,0.1-0.366,0.1-0.526       c0-0.241-0.053-0.393-0.233-0.393c-0.151,0-0.339,0.116-0.402,0.178c0.214-0.642,0.732-0.97,1.303-0.97       c0.704,0,1.077,0.624,1.077,1.319c0,0.097-0.007,0.205-0.026,0.303C8.069,5.893,8.488,5.509,8.943,5.509z M8.257,6.562       c0-0.152-0.037-0.187-0.072-0.187c-0.089,0-0.187,0.106-0.329,0.346c0.018,0.322,0.071,0.465,0.16,0.465       C8.114,7.185,8.257,6.872,8.257,6.562z M7.035,6.928c0.099,0,0.224-0.106,0.455-0.366c0.018-0.116,0.018-0.223,0.018-0.358       c0-0.177-0.071-0.374-0.178-0.374c-0.269,0-0.402,0.714-0.402,0.9C6.928,6.836,6.981,6.928,7.035,6.928z M8.488,7.72       c0.222,0,0.473-0.855,0.473-1.391c0-0.116-0.018-0.24-0.071-0.24c-0.188,0-0.5,0.883-0.5,1.363       C8.389,7.64,8.435,7.72,8.488,7.72z M6.304,7.23c0.304,0,0.65-1.641,0.65-1.918c0-0.071-0.026-0.125-0.088-0.125       c-0.276,0-0.66,1.561-0.66,1.909C6.206,7.158,6.224,7.23,6.304,7.23z"/>
                            </g>
                            <g>
                                <path d="M7.276,7.907c-0.384,0-0.402,0.465-0.402,1.401C6.59,8.692,6.117,8.032,5.564,8.032c-0.375,0-0.517,0.251-0.517,0.685       c0,0.091,0.009,0.224,0.025,0.304C5.118,8.87,5.261,8.808,5.439,8.808c0.384,0,0.848,0.293,1.151,0.695       C6.241,9.441,5.902,9.378,5.618,9.378c-0.179,0-0.339,0.018-0.473,0.081c-0.259,0.115-0.607,0.499-0.607,1.079       c0,0.089,0.01,0.188,0.027,0.295c0.311-0.697,1.141-1.009,1.676-1.009c0.107,0,0.187,0.009,0.249,0.019       c-0.274,0.249-0.337,0.686-0.355,0.98c-0.009,0.143-0.063,0.152-0.162,0.152c0,0.294,0.233,0.731,0.233,0.953       c0,0.082-0.044,0.153-0.089,0.171c0,0.391,0.391,0.677,0.391,0.926c0,0.063-0.019,0.116-0.045,0.143       c0.026,0.161,0.459,0.43,0.515,0.566c0.069,0.164,0.146,0.192,0.19,0.192c0.153,0,0.392-0.178,0.392-0.339       c0-0.053-0.045-0.115-0.08-0.142c-0.169-0.124-0.258-0.394-0.33-0.571c-0.063,0-0.143-0.025-0.171-0.13       c-0.049-0.185-0.052-0.529-0.123-0.734c-0.115-0.027-0.168-0.071-0.168-0.312c0-0.116,0.071-0.571,0.071-0.732       c-0.053,0-0.125-0.036-0.125-0.143c0-0.285,0.284-0.509,0.365-0.873c0.508,0.375,0.632,0.758,0.632,1.096       c0,0.178-0.026,0.349-0.061,0.508c0.375-0.187,0.936-0.464,0.936-1.025c0-0.33-0.152-0.696-1.159-0.839       c0.312-0.116,0.704-0.177,1.034-0.177c0.57,0,0.9,0.177,0.971,0.579c0.117-0.178,0.206-0.383,0.206-0.571       c0-0.437-0.367-0.722-0.83-0.722c-0.543,0-1.025,0.284-1.541,0.633C7.418,8.95,7.578,8.666,7.864,8.666       c0.045,0,0.089,0.009,0.133,0.018C7.891,8.291,7.49,7.907,7.276,7.907z"/>
                            </g>
                            <g>
                                <path d="M22.298,14.334c0.445,0,0.802,0.581,0.802,1.258c0,0.722-0.339,1.507-0.943,2.041c-0.01-1.202-1.482-0.819-1.482-1.692       c0-0.375,0.268-0.625,0.59-0.625c0.284,0,0.508,0.079,0.669,0.241c-0.16-0.151-0.241-0.367-0.241-0.572       C21.691,14.647,21.907,14.334,22.298,14.334z"/>
                            </g>
                            <g>
                                <path d="M15.681,5.215c-0.071-0.117-0.338-0.179-0.462-0.179c-0.393,0-0.659,0.276-0.714,0.526       c-0.036-0.088-0.062-0.197-0.062-0.303c0-0.392,0.269-0.873,0.92-0.873c0.569,0,0.791,0.302,0.872,0.302       c0.09,0,0.179-0.09,0.25-0.09c0.097,0,0.097,0.153,0.097,0.259c0,0.357-0.16,0.971-0.562,1.194       c-0.071-0.151-0.214-0.322-0.444-0.428c-0.064-0.026-0.089-0.08-0.089-0.134C15.488,5.394,15.577,5.268,15.681,5.215z        M14.336,5.865c0.233,0.224,0.437,0.321,0.686,0.321c0.1,0,0.215-0.026,0.278-0.026c0.079,0,0.134,0.035,0.134,0.096       c0,0.1-0.091,0.26-0.197,0.349c0.106,0.045,0.222,0.062,0.348,0.062c0.507,0,1.085-0.321,1.085-1.123       c0.108,0.142,0.171,0.437,0.171,0.571c0,0.972-0.715,1.345-1.372,1.345c-0.429,0-0.644-0.141-0.697-0.141       c-0.168,0-0.16,0.337-0.277,0.329c-0.205-0.035-0.391-0.491-0.391-0.973C14.105,6.392,14.176,6.089,14.336,5.865z"/>
                            </g>
                            <g>
                                <path d="M6.706,0.196c0-0.053-0.269-0.109-0.634-0.109c-0.58,0-0.499,0.482-0.945,0.482c-0.464,0-0.348-0.5-0.936-0.5       c-0.356,0-0.686,0.063-0.686,0.145c0,0.106,0.418,0.062,0.418,0.355c0,0.312-0.9,0.401-0.9,0.588       c0,0.063,0.071,0.09,0.161,0.09c0.196,0,0.508-0.09,0.732-0.09c0.124,0,0.241,0.027,0.241,0.144       c0,0.222-0.482,0.624-0.482,0.802c0,0.054,0.044,0.071,0.088,0.071c0.179,0,0.482-0.454,0.768-0.454       c0.472,0,0.159,1.007,0.418,1.007c0.268,0,0.152-0.99,0.534-0.99c0.313,0,0.545,0.686,0.759,0.686       c0.053,0,0.098-0.044,0.098-0.106c0-0.188-0.267-0.571-0.267-0.82c0-0.151,0.108-0.224,0.249-0.224       c0.205,0,0.482,0.127,0.633,0.127c0.053,0,0.107-0.018,0.107-0.08c0-0.214-0.793-0.446-0.793-0.722       C6.268,0.32,6.706,0.32,6.706,0.196z M8.801,1.104c0,0.161,0.561,0.508,0.82,0.508c0.151,0,0.195-0.205,0.195-0.42       c0-0.267-0.116-0.276-0.347-0.276C9.174,0.917,8.801,0.998,8.801,1.104z M9.727,2.869c0-0.533-1.447-1.506-1.463-1.924       c0-0.039,0.02-0.076,0.052-0.11c0.249-0.261,1.277-0.452,1.277-0.676c0-0.116-0.214-0.116-0.321-0.116       c-0.829,0-2.041,0.304-2.041,0.597c0,0.304,1.087,1.046,1.087,1.41c0,0.097-0.061,0.133-0.161,0.133       c-0.302,0-0.963-0.365-1.274-0.365c-0.142,0-0.195,0.098-0.195,0.241c0,0.428,0.507,1.24,0.507,1.48       c0,0.026-0.008,0.062-0.045,0.062c-0.16,0-0.917-0.892-1.185-0.892c-0.099,0-0.108,0.135-0.108,0.331v0.302       c0,0.206-0.009,0.331-0.107,0.331c-0.231,0-0.339-0.65-0.562-0.65c-0.231,0-0.277,1.159-0.5,1.159       c-0.258,0-0.035-1.277-0.285-1.277c-0.275,0-0.589,0.848-0.785,0.848c-0.071,0-0.088-0.071-0.088-0.133       c0-0.259,0.151-0.677,0.151-0.928c0-0.124-0.036-0.196-0.143-0.196c-0.277,0-0.882,0.446-1.113,0.446       c-0.037,0-0.081-0.018-0.081-0.055c0-0.214,0.971-0.891,0.971-1.194c0-0.294-1.337-0.097-1.337-0.437       c0-0.285,0.955-0.58,0.955-0.874c0-0.258-1.132-0.375-1.57-0.375c-0.526,0-0.811,0.062-0.811,0.214       c0,0.233,1.195,0.304,1.195,0.508c0,0.198-1.238,0.724-1.238,1.027c0,0.267,1.747,0.017,1.747,0.294       c0,0.302-1.526,1.613-1.526,2.049c0,0.099,0.073,0.144,0.171,0.144c0.462,0,1.665-0.883,1.996-0.883       c0.116,0,0.124,0.144,0.124,0.267c0,0.233-0.079,0.59-0.079,0.848c0,0.205,0.052,0.348,0.23,0.348       c0.331,0,0.633-0.561,0.857-0.561c0.285,0,0.116,1.65,0.543,1.65c0.365,0,0.518-1.784,0.748-1.784       c0.233,0,0.42,0.516,0.634,0.516c0.267,0,0.143-0.9,0.428-0.9c0.312,0,1.203,1.07,1.604,1.07c0.125,0,0.169-0.098,0.169-0.224       c0-0.472-0.659-1.541-0.659-1.881c0-0.089,0.026-0.114,0.124-0.114c0.348,0,1.365,0.48,1.846,0.48       C9.629,3.075,9.727,2.987,9.727,2.869z M1.588,2.352c0,0.179-0.679,0.776-0.919,0.776c-0.089,0-0.116-0.106-0.116-0.205       c0-0.179,0.082-0.428,0.178-0.508C0.847,2.308,1.115,2.255,1.32,2.255C1.444,2.255,1.588,2.282,1.588,2.352z M8.14,3.271       c0,0.312,1.115,1.836,1.329,1.836c0.178,0,0.312-0.312,0.312-0.579c0-0.071-0.018-0.141-0.053-0.196       c-0.16-0.223-1.292-1.116-1.543-1.116C8.157,3.217,8.14,3.245,8.14,3.271z"/>
                            </g>
                            <g>
                                <path d="M22.458,0.57c0,0.125,0.097,0.223,0.224,0.223c0.124,0,0.221-0.098,0.221-0.223c0-0.125-0.097-0.222-0.221-0.222       C22.555,0.347,22.458,0.445,22.458,0.57z M21.005,2.54c0-0.633-1.514-0.794-1.514-0.937c0-0.116,0.846-0.311,1.282-0.322       c-0.669-0.854-1.621-0.766-1.621-0.917c0-0.089,0.713-0.268,1.372-0.268c0.552,0,1.07,0.125,1.07,0.543       c0,0.233-0.187,0.474-0.187,0.83c0,0.198,0.098,0.367,0.355,0.367c0.277,0,0.34-0.296,0.34-0.608       c0-0.258-0.045-0.453-0.045-0.579c0-0.373,0.257-0.624,0.625-0.624c0.302,0,0.373,0.133,0.819,0.133       c-0.24,0.144-0.328,0.403-0.328,0.528c0,0.374,0.239,0.633,0.239,1.399c0,1.408-1.319,1.908-2.932,1.908       c-0.445,0-0.917-0.036-1.381-0.107c-0.072-0.008-0.089-0.027-0.089-0.071c0-0.115,0.633-0.178,0.633-0.748       c0-0.223-0.071-0.437-0.071-0.518c0-0.045,0.036-0.071,0.071-0.071c0.134,0,0.403,0.517,0.9,0.517       C20.675,2.995,21.005,2.951,21.005,2.54z M22.511,1.639c0,0.793-0.579,1.4-1.623,1.57c0.116,0.008,0.224,0.008,0.331,0.008       c1.219,0,1.667-0.551,1.667-1.016C22.886,1.942,22.743,1.711,22.511,1.639z"/>
                            </g>
                            <g>
                                <path d="M21.898,13.132c0.142-0.447,0.32-0.758,0.614-1.24c-0.293-0.151-1.069-0.473-1.069-0.999       c0-0.614,0.766-1.095,0.926-1.095c0.069,0,0.089,0.061,0.089,0.178c0,0.321-0.152,0.838-0.152,1.114       c0,0.249,0.16,0.491,0.303,0.491c0.152,0,0.571-0.535,0.571-1.061c0-0.945-0.83-1.231-1.086-1.231       c-0.24,0-0.676,0.394-1.703,0.394c-1.916,0-2.353-1.901-2.353-2.728c0-0.036,0.007-0.046,0.018-0.046       c0.044,0,0.231,0.232,0.837,0.232c0.313,0,0.598-0.08,1.054-0.08c1.067,0,1.542,0.739,2.201,1.685       c0.4,0.249,1.355,0.651,1.355,1.783c0,0.999-1.063,1.552-1.32,2.621c0.41-0.045,0.651-0.776,1.07-0.776       c0.214,0,0.312,0.171,0.312,0.437c0,0.392-0.222,0.981-0.65,1.345c0.009-0.035,0.009-0.08,0.009-0.133       c0-0.249-0.099-0.606-0.384-0.606c-0.445,0-0.587,0.482-0.838,0.883c-0.257-0.909-0.606-1.73-1.23-2.229       c-0.632-0.507-1.72-0.232-1.72-1.159c0-0.249,0.159-0.605,0.159-0.891c0-0.099-0.018-0.188-0.071-0.26       c0.857,0.322,0.553,0.892,1.081,1.481c0.327,0.375,1.237,0.732,1.765,2.273c0.007-0.044,0.016-0.16,0.016-0.24       c0-1.321-1.745-2.613-1.896-3.148c1.014,0.116,1.193,0.367,1.674,1.703C21.576,12.106,21.898,12.793,21.898,13.132z        M21.665,8.808c0-0.186-0.472-0.204-0.517-0.731c-0.009-0.081-0.036-0.223-0.135-0.223c-0.159,0-0.035,0.49-0.214,0.49       c-0.409,0-0.543-0.802-0.695-0.802c-0.035,0-0.077,0.027-0.077,0.134c0,0.098,0.018,0.16,0.018,0.277       c0,0.116-0.028,0.196-0.134,0.196c-0.241,0-0.455-0.561-0.661-0.561c-0.044,0-0.088,0.027-0.088,0.07       c0,0.107,0.178,0.304,0.178,0.402c0,0.214-0.58,0.098-0.58,0.277c0,0.078,0.081,0.106,0.188,0.106       c0.187,0,0.481-0.081,0.634-0.081c0.089,0,0.224,0.018,0.224,0.133c0,0.126-0.322,0.286-0.322,0.402       c0,0.053,0.054,0.08,0.098,0.08c0.241,0,0.667-0.419,0.971-0.419c0.053,0,0.186,0.027,0.186,0.108       c0,0.116-0.302,0.32-0.302,0.49c0,0.043,0.026,0.098,0.08,0.098c0.16,0,0.374-0.419,0.678-0.419       c0.115,0,0.285,0.044,0.375,0.044C21.638,8.879,21.665,8.835,21.665,8.808z"/>
                            </g>
                            <g>
                                <path d="M15.023,3.466c0.143,0,0.17,0.349,0.197,0.553c0.018,0.108,0.036,0.118,0.081,0.118c0.108,0,0.277-0.411,0.39-0.411       c0.171,0,0.626,0.473,1.383,0.473c1.077,0,2.096-0.759,2.096-2.095c0-1.293-0.91-2.05-2.167-2.05       c-0.598,0-1.035,0.294-1.267,0.294C15.595,0.356,15.379,0,15.273,0c-0.044,0-0.089,0.087-0.089,0.241       c0,0.098,0,0.409-0.108,0.409c-0.214,0-1.043-0.613-1.043-0.391c0,0.204,0.552,0.828,0.552,0.99c0,0.16-0.544,0.312-0.544,0.42       c0,0.195,0.58,0.231,0.58,0.48c0,0.25-0.606,0.447-0.606,0.633c0,0.151,0.606,0.046,0.606,0.233       c0,0.186-0.446,0.811-0.446,0.99c0,0.043,0.009,0.043,0.045,0.043C14.39,4.046,14.898,3.466,15.023,3.466z M15.282,2.006       c0-0.098-0.348-0.285-0.348-0.393c0-0.017,0.018-0.026,0.045-0.026c0.098,0,0.268,0.036,0.401,0.036       c0.118,0,0.134-0.499,0.222-0.499c0.062,0,0.169,0.473,0.269,0.473c0.116,0,0.328-0.135,0.419-0.135       c0.017,0,0.036,0.009,0.036,0.027c0,0.062-0.224,0.304-0.224,0.375c0,0.079,0.499,0.178,0.499,0.249       c0,0.089-0.508,0.08-0.508,0.161c0,0.063,0.186,0.312,0.186,0.393c0,0.018-0.009,0.026-0.027,0.026       c-0.071,0-0.346-0.124-0.426-0.124c-0.1,0-0.257,0.364-0.338,0.364c-0.028,0-0.044-0.034-0.044-0.08l-0.019-0.356       c0-0.035-0.017-0.073-0.061-0.073c-0.108,0-0.313-0.007-0.377-0.007c-0.044,0-0.062-0.01-0.062-0.027       C14.925,2.317,15.282,2.068,15.282,2.006z M17.02,3.7c-0.625,0-1.034-0.313-1.034-0.473c0-0.08,0.053-0.135,0.124-0.135       c0.196,0,0.624,0.303,0.768,0.303c0.035,0,0.062-0.016,0.062-0.071c0-0.16-0.151-0.427-0.151-0.562       c0-0.035,0.026-0.061,0.08-0.061c0.241,0,0.598,0.099,0.786,0.099c0.061,0,0.079-0.038,0.079-0.073       c0-0.196-0.58-0.58-0.58-0.696c0-0.106,0.721-0.268,0.721-0.436c0-0.179-0.979-0.055-0.979-0.224       c0-0.124,0.186-0.339,0.186-0.437c0-0.045-0.035-0.063-0.098-0.063c-0.08,0-0.508,0.169-0.686,0.169       c-0.089,0-0.197-0.018-0.197-0.142c0-0.205,0.348-0.428,0.893-0.428c0.881,0,1.407,0.608,1.407,1.622       C18.401,3.38,17.502,3.7,17.02,3.7z"/>
                            </g>
                            <g>
                                <path d="M10.984,19.122c0,0.082-0.026,0.171-0.098,0.26c-0.098-0.178-0.375-0.269-0.5-0.269c-0.917,0-0.571,1.329-1.55,1.329       c-0.41,0-0.447-0.055-0.598-0.055c-0.062,0-0.098,0.029-0.098,0.081c0,0.232,0.331,0.802,1.248,0.802       c0.919,0,1.802-0.561,1.802-1.257c0-0.116-0.027-0.239-0.081-0.365c0.035-0.053,0.126-0.089,0.205-0.089       c0.143,0,0.224,0.162,0.358,0.162c0.143,0,0.249-0.108,0.249-0.251c0-0.115-0.063-0.195-0.169-0.25       c0.071-0.053,0.124-0.142,0.124-0.241c0-0.151-0.107-0.292-0.285-0.292c-0.081,0-0.135,0.026-0.197,0.087       c-0.016-0.159-0.106-0.311-0.276-0.311c-0.135,0-0.233,0.097-0.233,0.25C10.886,18.855,10.984,18.972,10.984,19.122z"/>
                            </g>
                            <g>
                                <path d="M8.586,19.463c-0.268,0-0.669-0.287-0.669-0.446c0-0.135,0.124-0.206,0.222-0.206c0.224,0,0.624,0.277,0.624,0.509       C8.764,19.382,8.719,19.463,8.586,19.463z M6.099,17.466c0.713,0.176,1.069,0.561,1.141,1.015       c0.071,0.436,0.16,0.794,0.329,0.972c0.222,0.249,0.66,0.471,1.044,0.471c0.32,0,0.579-0.105,0.579-0.4       c0-0.32-0.437-1.043-1.078-1.043c-0.063,0-0.143,0.01-0.232,0.01c-0.08,0-0.197-0.018-0.268-0.08       c-0.143-0.124-0.187-0.794-0.454-1.194c-0.294-0.446-0.615-0.571-1.053-0.571c-0.312,0-0.659,0.17-0.659,0.418       C5.448,17.216,5.528,17.322,6.099,17.466z"/>
                            </g>
                            <g>
                                <path d="M10.575,16.376c0-0.4-0.83-0.409-0.83-1.015c0-0.153,0.097-0.41,0.293-0.687c0.081,0.463,0.268,0.704,0.67,0.856       c0.792,0.293,0.9,0.739,0.9,1.212c0,0.802-0.562,1.8-2.006,1.8c-1.159,0-1.989-1.034-1.989-1.907       c0-0.241,0.063-0.51,0.214-0.51c0.134,0,0.179,0.108,0.286,0.216c0.401,0.401,0.837,0.508,1.472,0.508       C10.155,16.85,10.575,16.619,10.575,16.376z M10.61,17.018c-0.306,0.141-0.428,0.117-0.428,0.43       c0,0.116-0.027,0.266-0.027,0.347c0,0.107,0.018,0.169,0.143,0.169c0.32,0,0.829-0.543,0.829-1.007       c0-0.124-0.071-0.179-0.152-0.179C10.904,16.778,10.824,16.921,10.61,17.018z M7.766,12.517c0-0.571,1.355-0.874,1.355-1.578       c0-0.117-0.044-0.322-0.125-0.473c0.473,0.26,0.82,0.696,0.82,1.053c0,0.614-0.642,0.899-0.642,1.283       c0,0.447,0.686,0.518,0.686,1.07c0,0.455-0.651,0.981-0.651,1.569c0,0.455,0.321,0.829,0.812,0.892       c-0.161,0.035-0.303,0.063-0.454,0.063c-0.901,0-1.828-0.74-1.828-1.624c0-0.437,0.187-0.819,0.472-1.095       c0.251,0.213,0.5,0.356,0.66,0.356c0.143,0,0.206-0.071,0.206-0.178C9.077,13.524,7.766,13.221,7.766,12.517z"/>
                            </g>
                            <g>
                                <path d="M2.594,16.921c0.038,0.304,0.322,0.535,0.644,0.499c0.115-0.011,0.222-0.045,0.293-0.089       c0.071,0.285,0.311,0.469,0.634,0.426c0.329-0.042,0.551-0.301,0.516-0.63c-0.009-0.09-0.026-0.145-0.053-0.206       c0,0,0.045-0.006,0.077-0.012c0.322-0.06,0.539-0.319,0.512-0.631c-0.036-0.32-0.324-0.559-0.624-0.523       c-0.116,0.016-0.222,0.059-0.296,0.122c-0.08-0.267-0.331-0.5-0.673-0.443c-0.312,0.052-0.516,0.315-0.484,0.649       c0.005,0.053,0.017,0.116,0.045,0.178c0,0-0.053,0.007-0.088,0.013C2.834,16.312,2.552,16.574,2.594,16.921z M4.26,16.57       c0.022,0.187-0.111,0.354-0.296,0.377c-0.186,0.021-0.355-0.113-0.375-0.299c-0.023-0.186,0.111-0.355,0.296-0.377       C4.071,16.25,4.239,16.384,4.26,16.57z"/>
                            </g>
                        </g>
                    </g>
                </g>
            </g>
        </svg>
        `}
      />
    );
  }
}

class SvgLayoutExample extends Component {
  static title = 'SVG with flex layout';
  render() {
    return (
      <View style={styles.container}>
        <Svg style={styles.svg}>
          <Rect
            width="80%"
            height="80%"
            x="10%"
            y="10%"
            fill="purple"
            stroke="yellow"
            strokeWidth="4"
          />
          <Line
            x1="10%"
            y1="10%"
            x2="90%"
            y2="90%"
            stroke="yellow"
            strokeWidth="4"
          />
          <Line
            x1="10%"
            y1="90%"
            x2="90%"
            y2="10%"
            stroke="yellow"
            strokeWidth="4"
          />
        </Svg>
      </View>
    );
  }
}

class CircleRectPathExample extends Component {
  static title = 'Path shaped marker on line';
  render() {
    return (
      <Svg height="100" width="100">
        <Rect x="0" y="0" width="100" height="100" fill="black" />
        <Circle cx="50" cy="50" r="30" fill="yellow" />
        <Circle cx="40" cy="40" r="4" fill="black" />
        <Circle cx="60" cy="40" r="4" fill="black" />
        <Path d="M 40 60 A 10 10 0 0 0 60 60" stroke="black" />
      </Svg>
    );
  }
}

class CurrentColorExample extends Component {
  static title = 'Line Path use currentColor';
  render() {
    return (
      <Svg
        width="130"
        height="130"
        fill="blue"
        stroke="red"
        color="green"
        viewBox="-16 -16 544 544">
        <Path
          d="M318.37,85.45L422.53,190.11,158.89,455,54.79,350.38ZM501.56,60.2L455.11,13.53a45.93,45.93,0,0,0-65.11,0L345.51,58.24,449.66,162.9l51.9-52.15A35.8,35.8,0,0,0,501.56,60.2ZM0.29,497.49a11.88,11.88,0,0,0,14.34,14.17l116.06-28.28L26.59,378.72Z"
          strokeWidth="32"
        />
        <Path d="M0,0L512,512" stroke="currentColor" strokeWidth="32" />
      </Svg>
    );
  }
}

class SvgG extends Component {
  static title = 'Line Path use currentColor';
  render() {
    return (
      <Svg height="100" width="200">
        <G rotation="50" origin="100, 50">
          <Line x1="60" y1="10" x2="140" y2="10" stroke="#060" />
          <Rect
            x="60"
            y="20"
            height="50"
            width="80"
            stroke="#060"
            fill="#060"
          />
          <Text x="100" y="75" stroke="#600" fill="#600" textAnchor="middle">
            Text grouped with shapes
          </Text>
        </G>
      </Svg>
    );
  }
}

class GExample extends Component {
  static title = 'G children props inherit and dynamic props change';
  state = {
    fill: 'purple',
  };
  componentDidMount = () => {
    setTimeout(() => {
      if (!this._unmounted) {
        this.setState({
          fill: '#856',
        });
      }
    }, 2000);
  };
  componentWillUnmount = () => {
    this._unmounted = true;
  };
  private _unmounted: any;
  render() {
    return (
      <Svg height="100" width="100">
        <G fill={this.state.fill} stroke="pink" strokeWidth="3">
          <Circle cx="25" cy="25" r="11" />
          <Circle cx="25" cy="75" r="11" stroke="red" />
          <Circle cx="50" cy="50" r="11" fill="green" />
          <Circle cx="75" cy="25" r="11" stroke="red" />
          <Circle cx="75" cy="75" r="11" />
        </G>
      </Svg>
    );
  }
}

class ImageExample extends Component {
  static title = 'Draw Image with preserveAspectRatio prop';
  render() {
    return (
      <Svg height="100" width="100">
        <Defs>
          <ClipPath id="image-clip">
            <Circle cx="50%" cy="50%" r="40%" />
          </ClipPath>
        </Defs>
        <Rect x="0" y="0" width="100%" height="100%" fill="red" />
        <Rect x="5%" y="5%" width="50%" height="90%" />
        <Image
          x="5%"
          y="5%"
          width="50%"
          height="90%"
          preserveAspectRatio="xMidYMid slice"
          opacity="0.5"
          href={{uri: dataUriExample}}
          clipPath="url(#image-clip)"
        />
        <Text
          x="50"
          y="50"
          textAnchor="middle"
          fontWeight="bold"
          fontSize="16"
          fill="blue">
          HOGWARTS
        </Text>
      </Svg>
    );
  }
}

class ClipImage extends Component {
  static title = 'Clip Image';
  render() {
    return (
      <Svg height="100" width="100">
        <Defs>
          <ClipPath id="clip-image">
            <Circle cx="50%" cy="50%" r="40%" />
          </ClipPath>
        </Defs>
        <Image
          onPress={() => Alert.alert('press on Image')}
          x="5%"
          y="5%"
          width="90%"
          height="90%"
          href={{uri: dataUriExample}}
          opacity="0.6"
          clipPath="url(#clip-image)"
        />
        <Text
          x="50"
          y="50"
          textAnchor="middle"
          fontWeight="bold"
          fontSize="16"
          fill="red">
          HOGWARTS
        </Text>
      </Svg>
    );
  }
}

const URIs = {
  invalid: 'https://en.wikipedia.org/wiki/File:Vector-based_example.svg',
  valid:
    'https://pixabay.com/get/g9bea6c6d0895a4b46db7e4627b0deb1d799a786a9f14ed733bb254dac4f069edad2b4b4c1a9e8c4b70d6e15b6e0e2da0.svg',
};

class SvgCssExample extends Component {
  constructor(props) {
    super(props);
    this.state = {
      uri: URIs.invalid,
    };
  }

  handlePress = () => {
    const {uri} = this.state;
    const newUri = uri === URIs.valid ? URIs.invalid : URIs.valid;
    this.setState({uri: newUri});
  };

  render() {
    const {uri} = this.state;
    const title =
      uri === URIs.invalid
        ? 'Render fallback due to invalid SVG'
        : 'Render Valid SVG';

    const buttonTitle = `Switch to ${
      uri === URIs.invalid ? 'valid' : 'invalid'
    } SVG`;

    return (
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <RNText>{title}</RNText>
        <View style={{paddingVertical: 20}}>
          <SvgCssUri onError={() => {}} uri={uri} width={200} height={200} />
        </View>
        <Button onPress={this.handlePress} title={buttonTitle} />
      </View>
    );
  }
}

const samples = [
  LinearGradientExample,
  HuaweiPathExample,
  SvgLayoutExample,
  CircleRectPathExample,
  CurrentColorExample,
  SvgG,
  GExample,
  ImageExample,
  ClipImage,
  SvgCssExample,
];

const styles = StyleSheet.create({
  container: {
    flex: 1,
    height: 100,
    width: 200,
    backgroundColor: 'red',
  },
  svg: {
    height: '80%',
    width: '80%',
    flex: 1,
    alignSelf: 'stretch',
  },
});

export default function () {
  return (
    <Tester style={{flex: 1}}>
      <ScrollView>
        <TestCase itShould="GExample with color change after 2 seconds">
          <GExample />
        </TestCase>
        <TestCase itShould="SVG with linearGradient">
          <LinearGradientExample />
        </TestCase>
        <TestCase itShould="Huawei SVG icon">
          <HuaweiPathExample />
        </TestCase>
        <TestCase itShould="Apple SVG icon">
          <ApplePathExample />
        </TestCase>
        <TestCase itShould="SVG xml example">
          <SvgXmlExample />
        </TestCase>
        <TestCase itShould="Blue fill, Red stroke pen and Green Line">
          <CurrentColorExample />
        </TestCase>
        <TestCase itShould="Rect, Circle, Path">
          <CircleRectPathExample />
        </TestCase>
        <TestCase itShould="Text Rect Line Parallel">
          <SvgG />
        </TestCase>
        <TestCase itShould="Draw Image with preserveAspectRatio prop">
          <ImageExample />
        </TestCase>
        <TestCase itShould="Clip Image">
          <ClipImage />
        </TestCase>
        <TestCase itShould="Show svg from valid uri">
          <SvgCssExample />
        </TestCase>
      </ScrollView>
    </Tester>
  );
}
